import React from 'react'
import { Card, Select } from 'antd';
import './GBRecharge.css'
import type { DatePickerProps } from 'antd';
import { DatePicker, Space } from 'antd';
import GBRecharge from '../../components/GBRechargeList/GBRecharge'
// 日期事件
const onChange: DatePickerProps['onChange'] = (date, dateString) => {
    console.log(date, dateString);
};
// 下拉事件
const handleChange = (value: string) => {
    console.log(` ${value}`);
};
const Index = () => {
    return (
        <div className='GBRecharge-box' style={{ background: '#f7f8fa' }}>
            <Card style={{ marginBottom: '15px' }}>
                <div className='GBRecharge-top'>
                    <div className='GBRecharge-title'>果币</div>
                    <div className='GBRecharge-con'>
                        <div className="GBRecharge-con1">
                            {/* 下拉选项 */}
                            <div className="GBRecharge-select">
                                <Space wrap>
                                    <Select
                                        defaultValue="业务类型"
                                        style={{ width: 150, marginRight: '50px' }}
                                        onChange={handleChange}
                                        options={[
                                            { value: '业务类型', label: '业务类型' },
                                            { value: '店铺名称', label: '店铺名称' },
                                            { value: '流水类型', label: '流水类型' },
                                        ]}
                                    />
                                </Space>
                            </div>
                            {/* 日期 */}
                            <div className="GBRecharge-date">
                                <p>日期查询: <Space style={{ width: 150, marginRight: '60px' }} direction="vertical">
                                    <DatePicker onChange={onChange} />
                                </Space></p>
                            </div>
                        </div>
                    </div>
                </div>
            </Card>
            <Card>
                <div className='GBRecharge-bottom'>
                    <GBRecharge></GBRecharge>
                </div>
            </Card>


        </div>
    )
}

export default Index